<script type="text/javascript"
        src="${pageContext.request.contextPath}/static/ueditor/third-party/SyntaxHighlighter/shCore.js"></script>
<link rel="stylesheet"
      href="${pageContext.request.contextPath}/static/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css">
<script type="text/javascript">
    SyntaxHighlighter.all();
</script>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>

<script src="${pageContext.request.contextPath}/static/bootstrap3/js/jquery-1.11.2.min.js"></script>

<script type="text/javascript">

    //重新加载验证码的图片
    function loadimage() {
        document.getElementById("randImage").src = "${pageContext.request.contextPath}/image.jsp?" + Math.random();
    }

    //点赞
    function upHit() {
        if (${currentUser==null}) {
            alert("请先登陆！！！");
            return;
        }
        $.post("${pageContext.request.contextPath}/blog/upHit.do",
            {'id':'${blog.id}'},
            function (result){
                if (result.success) {
                    window.location.reload();
                    alert("谢谢您的点赞！");
                }
                 else {
                     alert("系统错误！");
                 }
            },"json");
    }

    //提交评论
    function submitData() {
        var content = $("#content").val();
        var imageCode = $("#imageCode").val();
        if (${currentUser==null}) {
            alert("请先登陆！！！");
        }
        else if (content == null || content == '') {
            alert("请输入评论内容！");
        } else if (imageCode == null || imageCode == '') {
            alert("请填写验证码！");
        } else {
            $.post("${pageContext.request.contextPath}/comment/save.do", {
                    'content': content,
                    'imageCode': imageCode,
                    'blog.id': '${blog.id}',
                    'blogger.id': '${blog.getBlogger().getId()}'
                },
                function (result) {
                    if (result.success) {
                        window.location.reload();
                        alert("评论已提交成功，审核通过后显示！");
                    } else {
                        alert(result.errorInfo);
                    }
                }, "json");
        }
    }

    function showOtherComment() {
        $('.otherComment').show();
    }

    //根据关键字查询
    function query1(keyWord) {
        $("#q1").val(keyWord);
        $("#queryForm").submit();
    }



</script>

<div class="data_list">

    <div class="data_list_title">
        <img src="${pageContext.request.contextPath}/static/images/blog_show_icon.png"/>
        技术共享家园，在这里您将获得更好的成长！
    </div>

    <div>

        <div class="blog_title"><h3><strong>${blog.title }</strong></h3></div>

        <div style="padding-left: 330px;padding-bottom: 20px;padding-top: 10px">
            <div class="bshare-custom">
                <a title="分享到QQ空间" class="bshare-qzone"></a>
                <a title="分享到新浪微博" class="bshare-sinaminiblog"></a>
                <a title="分享到人人网" class="bshare-renren"></a>
                <a title="分享到腾讯微博" class="bshare-qqmb"></a>
                <a title="分享到网易微博" class="bshare-neteasemb"></a>
                <a title="更多平台" class="bshare-more bshare-more-icon more-style-addthis"></a>
                <span class="BSHARE_COUNT bshare-share-count">0</span>
            </div>
            <script type="text/javascript" charset="utf-8"
                    src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=1&amp;lang=zh"></script>
            <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>
        </div>

        <div class="blog_info">
            作者：${blog.getBlogger().userName}
            &nbsp;&nbsp;发布时间： <fmt:formatDate value="${blog.releaseDate }" type="date" pattern="yyyy-MM-dd HH:mm"/>
            &nbsp;&nbsp;文章分类：${blog.blogType.typeName}
            &nbsp;&nbsp;阅读(${blog.clickHit})
            &nbsp;&nbsp;评论(${blog.replyHit})
            &nbsp;&nbsp;点赞(${blog.upHit})
        </div>

        <div class="blog_content">
            ${blog.content }
        </div>

        <div class="publishButton" align="center">
            <button class="btn btn-primary" type="button" onclick="upHit()">点个赞吧</button>
        </div>


        <div class="blog_keyWord">
            <font><strong>关键字：</strong></font>
            <c:choose>
                <c:when test="${keyWords==null}">
                    &nbsp;&nbsp;无
                </c:when>

                <c:otherwise>
                    <form id="queryForm" action="${pageContext.request.contextPath}/blog/q.html" method="post">
                        <input type="hidden" id="q1" name="q">
                        <c:forEach var="keyWord" items="${keyWords }">
                            &nbsp;&nbsp;<a href="javascript:query1('${keyWord}')" target="_blank">${keyWord }</a>&nbsp;&nbsp;
                        </c:forEach>
                    </form>
                </c:otherwise>
            </c:choose>
        </div>

        <div class="blog_lastAndNextPage">
            ${pageCode }
        </div>

    </div>

</div>

<div class="data_list">

    <div class="data_list_title">
        <img src="${pageContext.request.contextPath}/static/images/comment_icon.png"/>
        大家的评论
        <c:if test="${commentList.size()>10}">
            <a href="javascript:showOtherComment()" style="float: right;padding-right: 40px;">显示所有评论</a>
        </c:if>
    </div>

    <div class="commentDatas">
        <c:choose>

            <c:when test="${commentList.size()==0}">
                暂无评论
            </c:when>

            <c:otherwise>
                <c:forEach var="comment" items="${commentList }" varStatus="status">
                    <c:choose>
                        <c:when test="${status.index<10 }">
                            <div class="comment">
									<span>
										<font>
										${status.index+1 }楼&nbsp;&nbsp;&nbsp;&nbsp;
										${comment.userNumber }&nbsp;${comment.userName}：
										</font>
										${comment.content }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;
										<fmt:formatDate value="${comment.commentDate }" type="date"
                                                        pattern="yyyy-MM-dd HH:mm"/>&nbsp;]
									</span>
                            </div>
                        </c:when>
                        <c:otherwise>
                            <div class="otherComment">
                                <div class="comment">
										<span>
											<font>
											${status.index+1 }楼&nbsp;&nbsp;&nbsp;&nbsp;
											${comment.userNumber }&nbsp;${comment.userName}：
											</font>
											${comment.content }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
											[&nbsp;<fmt:formatDate value="${comment.commentDate }" type="date"
                                                                   pattern="yyyy-MM-dd HH:mm"/>&nbsp;]
										</span>
                                </div>
                            </div>
                        </c:otherwise>
                    </c:choose>
                </c:forEach>
            </c:otherwise>

        </c:choose>
    </div>

</div>

<div class="data_list">

    <div class="data_list_title">
        <img src="${pageContext.request.contextPath}/static/images/publish_comment_icon.png"/>
        发表评论
    </div>

    <div class="publish_comment">
        <div>
            <textarea style="width: 100%" rows="3" id="content" name="content" placeholder="来说两句吧！！"></textarea>
        </div>

        <div class="verCode">
            验证码：<input type="text" value="${imageCode }" name="imageCode" id="imageCode" size="10"
                       onkeydown="if(event.keyCode==13) submitData()"/>&nbsp;
            <img onclick="javascript:loadimage();" title="换一张试试" name="randImage" id="randImage"
                 src="${pageContext.request.contextPath}/image.jsp" width="60" height="20" border="1" align="absmiddle">
        </div>

        <div class="publishButton">
            <button class="btn btn-primary" type="button" onclick="submitData()">发表评论</button>
        </div>
    </div>

</div>